<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="com.google.appengine.api.users.User" %>
<%@ page import="com.google.appengine.api.users.UserService" %>
<%@ page import="com.google.appengine.api.users.UserServiceFactory" %>
<%@ page import="com.appology.jokes.Joke" %>
<%@ page import="com.appology.chuck.ChuckUser" %>
<%@ page import="com.appology.chuck.ChuckUserBuilder" %>
<%
	UserService userService = UserServiceFactory.getUserService();
	User user = userService.getCurrentUser();
	
	String name = null;
	if (user == null) { 
		name = "Chuck Norris";
	} else {
	    ChuckUser chuckUser = ChuckUserBuilder.getChuckUserByGoogleId(userService.getCurrentUser().getUserId());
		if(chuckUser == null){
		name = user.getNickname();
		} else {
		name = chuckUser.getDisplayName();
		}
	}
	String joke = Joke.getInstance().getRandom(name);
%>
<!doctype html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if lt IE 7 ]> <html class="no-js ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]>    <html class="no-js ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]>    <html class="no-js ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
  <meta charset="utf-8">


  <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame
       Remove this if you use the .htaccess -->
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>Better than Chuck | Appology</title>
    <!-- Mobile viewport optimized: j.mp/bplateviewport -->
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <!-- Place favicon.ico & apple-touch-icon.png in the root of your domain and delete these references -->
  <link rel="shortcut icon" href="/favicon.ico">
  <link rel="apple-touch-icon" href="/apple-touch-icon.png">


  <!-- CSS: implied media="all" -->
  <link rel="stylesheet" href="css/style.css?v=2">
  <link rel="stylesheet" href="css/view.css?v=2">
  <!-- Uncomment if you are specifically targeting less enabled mobile browsers
  <link rel="stylesheet" media="handheld" href="css/handheld.css?v=2">  -->

  <!-- All JavaScript at the bottom, except for Modernizr which enables HTML5 elements & feature detects -->
  <script src="js/libs/modernizr-1.7.min.js"></script>
  </head>

  <body id="main_body">
  <img id="top" src="img/top.png" alt="">
  <div  id="form_container">
    <header>
	<h1><a>Get another joke</a></h1>
    </header>
    <div id="main" role="main">
    <form id="form_194508" class="appnitro"  method="post" action="">
		<div class="form_description">
			<h2><img class="logo" src="/img/appology-50.png">Facts about <%= name %></h2>
			<% if (user != null){ %>
			<p>Only the facts, and all about you.</p>
			<% } else { %>
			<p>Chuck Norris is great, but <a href="/app">sign in</a> to see facts about you.</p>
			<% } %>
		</div>		

<p id="joke_text"><%= joke %></p>
			
			<ul >
			
					
			
					<li class="buttons">
			    <input type="hidden" name="form_id" value="194508" />
			    
				<input id="saveForm" class="button_text" type="submit" name="submit" value="Get another fact" />
				<input id="post_to_buzz" class="button_text" type="submit" name="post-to-buzz" value="Post to Buzz" />
				<img class="loader" style="display:none;" src="/img/ajax-loader.gif">
		</li>
		<li id="buzz_response"></li>
			</ul>
		</form>	

    </div>
    <footer  id="footer">
    <%
    if (user != null) {
    %>

<p>
<a href="<%= userService.createLogoutURL(request.getRequestURI()) %>">sign out</a></p>
<%
    } else {
%>
<p>
<a href="/app">Sign in</a>
to get awesome facts about you.</p>
<%
    }
%>		
    </footer>
  </div> <!--! end of #container -->
  <img id="bottom" src="img/bottom.png" alt="">
<!-- JavaScript at the bottom for fast page loading -->

  <!-- Grab Google CDN's jQuery, with a protocol relative URL; fall back to local if necessary -->
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.js"></script>
  <script>window.jQuery || document.write("<script src='js/libs/jquery-1.5.1.min.js'>\x3C/script>")</script>


  <!-- scripts concatenated and minified via ant build script-->
  <script src="js/plugins.js"></script>
  <script src="js/script.js"></script>
  <script src="js/view.js"></script>
  <script>
  var runningRequest = false;
  $(document).ready(function() {
	  $('#form_194508').submit(function(e){
	          e.preventDefault();
	          
	          
	  });
	  $('#saveForm').bind('click',getJoke);
	  $('#post_to_buzz').bind('click',postToBuzz);
  });
  
  function postToBuzz(){
  		var jokeText = $('#joke_text').text();
  		$('.loader').fadeIn(50);
   		request = $.get('postactivity',{joke:jokeText}, function(data) {
	            runningRequest=false;
	            if(data !== "failed"){
	            	$('#post_to_buzz').attr('disabled', 'disabled').addClass("disabled-button");
	            	$('#buzz_response').html('Posted to buzz <a href="' +data+'">My Buzz Profile</a>' ).removeClass("error").addClass("success");
	            
	            } else {
	            	$('#buzz_response').text("There was an error posting to Buzz").addClass("error").removeClass("success");
	            }
	            $('.loader').fadeOut('fast');
	            $('#buzz_response').fadeIn('fast');
					
	              });
  }
  
  function getJoke(){
  	if(runningRequest){
    	request.abort();
  	}
  	$('.loader').fadeIn(50);
   runningRequest=true;
	        request = $.get('betterthanchuck',{random:'true'}, function(data) {
	            runningRequest=false;
	            $('#joke_text').fadeOut(50, function() {
	            	$('#joke_text').html(data);
	            	$('#buzz_button').attr('data-message',data);
	            	$.getScript("http://www.google.com/buzz/api/button.js");
	            	$('#post_to_buzz').removeAttr('disabled').removeClass("disabled-button");
	            	$('#buzz_response').fadeOut('fast',function(){
	            		$('#buzz_response').removeClass("success error");
	            	});
	            	$('.loader').fadeOut('fast');
					$('#joke_text').fadeIn('fast');
					
					
	              });
	        });
  }
  </script>
  <!-- end scripts-->


  <!--[if lt IE 7 ]>
    <script src="js/libs/dd_belatedpng.js"></script>
    <script>DD_belatedPNG.fix("img, .png_bg"); // Fix any <img> or .png_bg bg-images. Also, please read goo.gl/mZiyb </script>
  <![endif]-->

	<script type="text/javascript" src="http://www.google.com/buzz/api/button.js"></script>
  </body>
</html>
